<template>
    <div style="width: 100%;">
        <div class="searchBox">
            <div class="topSelectBox">
                <el-select v-model="store.bigSelectValue" placeholder="Select" size="large" :border="false">
                    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
                </el-select>
            </div>
            <div class="shuxianfenge"></div>
            <div class="topInputBox">
                <el-input v-model="store.bigInputValue" placeholder="请输入..." clearable />
            </div>
            <div class="sosuoBox" @click="searchfun">搜索</div>
        </div>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { useStore } from '@/store/store';
const store = useStore()
const router = useRouter();
const emit = defineEmits(['searchClick'])
const options = [
    {
        value: '新闻',
        label: '新闻',
    },
    {
        value: '企业',
        label: '企业',
    },
    {
        value: '金融',
        label: '金融',
    },
    {
        value: '供需',
        label: '供需',
    },
    {
        value: '商城',
        label: '商城',
    },
    {
        value: '展会',
        label: '展会',
    },
]
// 搜索点击
const searchfun = () => {
    console.log(router.currentRoute.value.path);
    const currentPath = router.currentRoute.value.path;
    if (store.bigSelectValue === '新闻') {
        if (currentPath === '/newsList') {
            router.replace({
                path: currentPath,
                query: {
                    searchType: true,
                    title: store.bigInputValue
                }
            });
            emit('searchClick', store.bigInputValue);
        } else {
            router.push({
                path: '/newsList',
                query: {
                    searchType: true,
                    title: store.bigInputValue
                }
            });
        }
    }
    if (store.bigSelectValue === '企业') {
        if (currentPath === '/EnterpriseList') {
            router.replace({
                path: currentPath,
                query: {
                    searchType: true,
                    name: store.bigInputValue
                }
            });
            emit('searchClick', store.bigInputValue);
        } else {
            router.push({
                path: '/EnterpriseList',
                query: {
                    searchType: true,
                    name: store.bigInputValue
                }
            });
        }
    }
    if (store.bigSelectValue === '金融') {
        if (currentPath === '/financeList') {
            router.replace({
                path: currentPath,
                query: {
                    searchType: true,
                    name: store.bigInputValue
                }
            });
            emit('searchClick', store.bigInputValue);
        } else {
            router.push({
                path: '/financeList',
                query: {
                    searchType: true,
                    name: store.bigInputValue
                }
            });
        }
    }
    if (store.bigSelectValue === '供需') {
        if (currentPath === '/supplyList') {
            router.replace({
                path: currentPath,
                query: {
                    searchType: true,
                    shop_name: store.bigInputValue
                }
            });
            emit('searchClick', store.bigInputValue);
        } else {
            router.push({
                path: '/supplyList',
                query: {
                    searchType: true,
                    shop_name: store.bigInputValue
                }
            });
        }   
    }
    if (store.bigSelectValue === '商城') {
        if (currentPath === '/goodsList') {
            router.replace({
                path: currentPath,
                query: {
                    searchType: true,
                    name: store.bigInputValue
                }
            });
            emit('searchClick', store.bigInputValue);
        } else {
            router.push({
                path: '/goodsList',
                query: {
                    searchType: true,
                    name: store.bigInputValue
                }
            });
        }
    }
    if (store.bigSelectValue === '展会') {
        if (currentPath === '/ExhibitionList') {
            router.replace({
                path: currentPath,
                query: {
                    searchType: true,
                    name: store.bigInputValue
                }
            });
            emit('searchClick', store.bigInputValue);
        } else {
            router.push({
                path: '/ExhibitionList',
                query: {
                    searchType: true,
                    name: store.bigInputValue
                }
            });
        }
    }

}
</script>
<style scoped lang="scss">
.searchBox {
    border: 2px solid $green-color;
    padding: 2px;
    box-sizing: border-box;
    border-radius: 8px;
    display: flex;
    align-items: center;
    background: #fff;
}

.topSelectBox {
    width: 90px;
    flex-shrink: 0;
}

.shuxianfenge {
    width: 1px;
    height: 18px;
    background: #CCCCCC;
    border-radius: 8px;
}

.topInputBox {
    flex-grow: 1;
    margin-left: 10px;
}

.sosuoBox {
    margin-left: 20px;
    font-size: 16px;
    color: #FFFFFF;
    padding: 8px 20px;
    background: $green-color;
    border-radius: 6px;
    flex-shrink: 0;
    cursor: pointer;
}

:deep(.el-select__wrapper) {
    box-shadow: none !important;
    border: none !important;
}

:deep(.el-input__wrapper) {
    box-shadow: none !important; // 移除输入框阴影边框
    border: none !important; // 移除输入框线条边框
}
</style>